/**
 * Created by liuzengrong on 2019/8/16.
 */
import React from 'react';
import { connect } from 'dva';
import { Button, message } from 'antd';
import StandardModule from '@/components/hyperspace/modules/StandardModule';

/**
 * 自定义模块
 */
// @ts-ignore
const LocalModule: React.FC = ({ standardModuleExample, dispatch }) => (
  <StandardModule
    data={standardModuleExample.data}
    dictionary={[
      {
        name: 'username',
        desc: '用户名',
        dataType: 'string',
      },
    ]}
    config={{
      common: {
        formItemOptions: {
          username: {
            rules: [{ required: true, message: '该字段不能为空！' }],
          },
          upload: {
            showOptions: {
              sm: 24,
              md: 24,
            },
          },
        },
        selectRows: true, // 是否选择开关
        fieldGroup: {
          edit: [
            {
              groupName: '基本信息',
              before: 'username',
            },
            {
              groupName: '分组B',
              before: 'creatTime',
            },
          ],
        },
      },
      search: {
        fields: ['username', 'mobile', 'email'], // 查询条件
        tabs: {
          field: 'status',
          tabItems: [
            {
              title: '全部',
              value: '',
              active: true,
            },
            {
              title: '待审核',
              value: 'TO_AUDIT',
            },
            {
              title: '审核通过',
              value: 'AUDIT_PASS',
            },
            {
              title: '审核失败',
              value: 'AUDIT_FAIL',
            },
            {
              title: '已上架',
              value: 'ONLINE',
            },
            {
              title: '已下架',
              value: 'OFFLINE',
            },
          ],
        }, // 状态栏
      },
      list: {
        url: '/api/query',
        fields: [
          'id',
          'mobile',
          'email',
          'creator',
          'creatTime',
          'updator',
          'updateTime',
          'username',
        ], // 列表字段
        format: {
          username: {
            render: (value: any) => `格式化 - ${value}`,
          },
        },
        table: {
          // Table组件属性
          scroll: { x: 2600 },
        },
        extensions: {
          operations: [
            (record: any) => (
              <a
                onClick={() => {
                  message.info(`扩展操作：${JSON.stringify(record)}`);
                }}
              >
                扩展操作
              </a>
            ),
          ],
        },
      },
      add: {
        url: '/api/create',
        // width: 680, // 非必填，默认680px
        // title: '新建表单', // 非必填，默认`新建`
        fields: [
          'username',
          'mobile',
          'email',
          'creator',
          'creatTime',
          'updator',
          'updateTime',
          'remark',
          'upload',
        ], // 新增表单字段
      },
      update: {
        url: '/api/update',
        // width: 680, // 非必填，默认680px
        // title: '新建表单', // 非必填，默认`新建`
        fields: ['username', 'mobile', 'email', 'creator', 'creatTime', 'updator', 'updateTime'], // 修改表单字段
        primaryKeys: ['id'], // 主键字段列表
      },
      delete: {
        url: '/api/remove',
        batchDeleteUrl: '/api/batchRemove', // 批量删除URL
        batchDelete: true, // 是否开启批量删除
        fields: ['id'], // 删除依据字段
      },
      extensions: {
        operations: [
          // 外层操作
          (selectedRows: [], search: () => void) => (
            <Button
              key={1}
              style={{ marginLeft: 8 }}
              onClick={() => {
                message.info(`外层扩展操作：${JSON.stringify(selectedRows)}`);
                search();
              }}
            >
              扩展操作
            </Button>
          ),
        ],
      },
    }}
    namespace="standardModuleExample"
    dispatch={dispatch}
  />
);

// @ts-ignore
export default connect(({ standardModuleExample }) => ({
  standardModuleExample,
}))(LocalModule);
